<template>
    <div class="views-zhuye">
        <div>
            <e-container>
                <el-carousel indicator-position="outside" height="560px">
                    <el-carousel-item v-for="item in bhtList" :key="item.id">
                        <router-link :to="item.url">
                            <div
                                style="background-size: cover"
                                @click="$goto(item.url)"
                                :style="{'background-image': 'url('+$formatImageSrc(item.image)+')',width:'100%', height: '560px'}"
                            ></div>
                        </router-link>
                    </el-carousel-item>
                </el-carousel>
            </e-container>
        </div>
        <div>
            <e-container>
                <div class="title-sn-title-shinei">
                    <div class="sn-title">

                        <span> 电影排行榜 </span>
                    </div>
                    <div class="sn-content">
                        <el-row :gutter="30">
                            <el-col v-for="r in dianyingxinxilist" :md="6" :key="r.id" style="margin-bottom: 20px">
                                <article class="single_product v-module-xiezi">
                                    <figure>
                                        <div class="product_thumb" @click="$goto('/dianyingxinxi/detail?id='+r.id)">
                                            <div class="label_product"></div>
                                            <e-img class="primary_img" :src="r.dianyinghaibao" pb="100" :is-scale="true" />
                                        </div>
                                        <figcaption class="product_content">
                                            <h4 class="product_name"><a href="javascript:;" @click="$goto('/dianyingxinxi/detail?id='+r.id)"> {{ r.dianyingmingcheng }}</a></h4>
                                            <div class="price_box">
                                                <span class="current_price" v-if="r.pingfen">评分：{{ r.pingfen }}</span>
                                            </div>
                                            <div class="add_to_cart">
                                                <a href="javascript:;" title="查看详情" @click="$goto('/dianyingxinxi/detail?id='+r.id)">查看详情</a>
                                            </div>
                                        </figcaption>
                                    </figure>
                                </article>
                            </el-col>
                        </el-row>
                    </div>
                </div>
            </e-container>
        </div>
        <div>
            <e-container>
                <div class="title-sn-title-shinei">
                    <div class="sn-title">

                        <span> 电影信息 </span>
                    </div>
                    <div class="sn-content">
                        <el-row :gutter="15">
                            <el-col v-for="r in dianyingxinxilist1" :md="6" :key="r.id" style="margin-bottom: 20px">
                                <div class="photo-content">
                                    <router-link class="thumbs" :to="'/dianyingxinxi/detail?id='+r.id">
                                        <e-img :src="r.dianyinghaibao" :pb="100"></e-img>
                                    </router-link>
                                    <div class="photo-content-text">
                                        <router-link :to="'/dianyingxinxi/detail?id='+r.id">
                                            <h3>{{ r.dianyingmingcheng }}</h3>
                                        </router-link>
                                        <div class="description" v-if="r.dianyingxiangqing" v-text="$substr(r.dianyingxiangqing , 30)"></div>
                                        <div class="other-content">
                                            <span>分类: <e-select-view module="dianyingfenlei" :value="r.fenlei" select="id" show="fenleimingcheng"></e-select-view></span>
                                            <span>电影类型:{{ r.dianyingleixing }}</span>
                                            <span>影票价格:{{ r.yingpiaojiage }}</span>
                                        </div>
                                    </div>
                                </div>
                            </el-col>
                        </el-row>
                    </div>
                </div>
            </e-container>
        </div>
        <div>
            <e-container>
                <div class="title-sn-title-shinei">
                    <div class="sn-title">

                        <span> 影院信息 </span>
                    </div>
                    <div class="sn-content">
                        <div class="">
                            <div class="e-news-info clearfix" v-for="r in yingyuanxinxilist" :key="r.id">
                                <div class="thumb" v-if="r.yingyuantupian" @click="$goto('/yingyuanxinxi/detail?id='+r.id)">
                                    <e-img :src="r.yingyuantupian" pb="100" />
                                </div>
                                <div class="news-content-text" :class="{'not-thumb':!r.yingyuantupian}">
                                    <h3 @click="$goto('/yingyuanxinxi/detail?id='+r.id)">{{ r.yingyuanmingcheng }}</h3>
                                    <div class="description" v-html="$substr(r.yingyuanmiaoshu,30)"></div>
                                    <div class="other-content">
                                        <span>负责人:{{ r.fuzeren }}</span>
                                        <span>联系电话:{{ r.lianxidianhua }}</span>
                                        <span>影院地址:{{ r.yingyuandizhi }}</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </e-container>
        </div>
    </div>
</template>

<script setup>
    import http from '@/utils/ajax/http';
    import DB from '@/utils/db';

    import {ref,reactive} from 'vue';
    import {useRoute} from 'vue-router';
    import {session} from '@/utils/utils';

    const route = useRoute();
    // 获取轮播图信息
    const bhtList = DB.name("lunbotu").order("id desc").limit(5).selectRef();

    // 定义响应式变量dianyingxinxilist,并获取数据电影信息模块的数据
    const dianyingxinxilist = DB.name('dianyingxinxi').limit("4").order("pingfen desc").selectRef();

    // 定义响应式变量dianyingxinxilist1,并获取数据电影信息模块的数据
    const dianyingxinxilist1 = DB.name('dianyingxinxi')/*.where('shifoushangjia='上架'')*/.limit("4").order("yingpiaojiage desc").selectRef();

    // 定义响应式变量yingyuanxinxilist,并获取数据影院信息模块的数据
    const yingyuanxinxilist = DB.name('yingyuanxinxi').where('issh','是').limit("40").order("id desc").selectRef();
</script>

<style scoped lang="scss">
    .views-zhuye {
    }
</style>
